<h3>描述</h3>
<p>tab页签组件内容区为组件的示例</p>
<h3>示例</h3>

<h4>1.方式一(在内容区直接以标签的形式使用组件):</h4>
<br />
<div>
  <ti-tabs>
    <ti-tab [(active)]="active">
      <!-- 自定义header时使用ti-tab-header -->
      <ti-tab-header><span>{{title1}}</span></ti-tab-header>
      <app-libary></app-libary>
    </ti-tab>
    <ti-tab [header]="title2">
      <app-company></app-company>
    </ti-tab>
    <ti-tab [header]="title3">
      <app-concert [type]="type"></app-concert>
    </ti-tab>
  </ti-tabs>
</div>
<br /><br />
<h4>2.方式二(ngFor循环时，在内容区可借助Angular提供的ngComponentOutlet指令插入组件):</h4>
<br />
<div>
  <ti-tabs>
    <ti-tab *ngFor="let tab of tabs" [header]="tab.title" [(active)]="tab.active">
      <!-- 注意：如果不需要给组件传递参数时，就不需要设置 injector，直接这样使用就行
            <ng-container *ngComponentOutlet="tab.component"></ng-container>
            -->
      <ng-container *ngComponentOutlet="tab.component; injector: getInjector(tab)"></ng-container>
    </ti-tab>
  </ti-tabs>
</div>
